<template>
  <div style="text-align: left">

    <Select placeholder="缓存类型" v-model="tParam.currentCache" :clearable=true class="y_condition"
            style="text-align: left;" >
      <Option v-for="(item,index) in caches" :value="index" :key="index">{{ item.name }}</Option>
    </Select>
    <Button type="primary" icon="=ios-trash-outline" class="y_condition" @click="clearCache">清理缓存</Button>


  <List border style="margin: 1rem 0rem">

    <div >
      <ListItem v-for="(item,index) in pageType" :key="item.value" >
        <div class="list_item">
        <div class="item_top">
          <p style="font-weight: bold">{{ item.name }}</p>
        </div>
        <div>
<!--          <KeyValueView title="访问地址" oneline :value="webDomain+item.linkUrl" ></KeyValueView>-->
          <span style="margin-right: 0.25rem">参考地址:</span>
          <a :href="hasCreated(item.linkUrl)?webDomain+item.linkUrl:'javascript:void(0)'"
             :style="hasCreated(item.linkUrl)?'':'pointer-events:none'" :disabled=!hasCreated(item.linkUrl) target="_blank" v-text="webDomain+item.linkUrl"></a>
        </div>
        </div>
        <div class="item_bottom" >
          <Button type="info" class="y_condition"  ghost @click="createPage(index)">生成页面</Button>
        </div>
      </ListItem>
    </div>
  </List>
  </div>
</template>

<script>
import tiyData from "./initWebPage/init_web_data";
import KeyValueView from "../widgets/KeyValueView";
import {
  init,
  createPage,
  clearCache
} from "./initWebPage/init_web_funs";

export default {
  name: "InitWebPage",
  data() {
    return {
      tParam: tiyData.tParams,
      pageType:tiyData.tData.pageType,
      caches:tiyData.tData.caches,
      createLink:tiyData.tParams.createLink,
      webDomain:this.$store.getters.webDomain
    }
  },
  computed:{
    // getStandsShortLink(item) {
    //   if(isEmpty(item.shortLink)) {
    //     if(this.isIndexPageType(item.type)) {
    //       return this.$store.getters.webDomain;
    //     }else{
    //       return "";
    //     }
    //   }else{
    //     return this.$store.getters.webDomain+item.shortLink;
    //   }
    // },

  },
  methods: {

    createPage:function(index){
      createPage(this,index);
    },
    hasCreated:function(url){
      if(url.endsWith("*")){
        return false;
      }
      return true;
    },
    clearCache:function(){
      if (this.tParam.currentCache===-1){
        this.$Message.info('未选择缓存类型');
      }else{
        clearCache(this,tiyData)
      }

    }

  },
  components: {
    KeyValueView
  },
  mounted() {

  }
}
</script>

<style scoped lang="less">
@import  (once,optional) "../css/base.less";
.y_condition{
  max-width: 150px;
  margin-right: 1rem;
  margin-top:0.5rem;
}
.list_item{
  width:45%;
.flex-colum-wrap;
  justify-items: left;
  align-items: start;
.item_top{
  width: 100%;
.flex-row-wrap;
  justify-content: space-between;
}

.item_bottom{
  margin-top: 0.3rem;
  width: 100%;
.flex-row-wrap;
  justify-content: space-between;
p{
  flex-grow: 2;
  text-align: left;
}
}
}
</style>
